<!-- lqt-送达日期弹窗效果 -->
<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport"
    content="width=device-width, initial-scale=1.0,user-scalable=no,minimum-scale=1.0,maximum-scale=1.0" />
  <title>送达日期弹窗效果</title>
  <link rel="stylesheet" href="./css/date-popup.min.css">
  <link rel=" shortcut icon" href="./fonts/favicon.ico" type="image/x-icon" />
</head>

<body>
  <div class="web">
    <!-- 公共头部 -->
    <header>
      <div class="header">填写订单</div>
    </header>
    <!-- 主体区域 -->
    <main>
      <!-- 信息 -->
      <div class="content">
        <div class="item">
          <div class="item-left">收货信息</div>
          <div class="item-right">
            <a href="">请选择收货信息</a>
          </div>
        </div>
        <div class="item">
          <div class="item-left">送达日期</div>
          <div class="item-right">
            <a href="">2022-12-30</a>
          </div>
        </div>
        <div class="item">
          <div class="item-left">配送时间</div>
          <div class="item-right">
            <a href="">不限时段</a>
          </div>
        </div>
        <div class="item">
          <div class="item-left">配送方式</div>
          <div class="item-right">
            <a href="">市区免费配送</a>
          </div>
        </div>
      </div>
      <!-- 日历 -->
      <div class="calendar">
        <div class="month">十二月，2022</div>
        <div class="item">
          <div class="item-top">
            <div class="date">28</div>
            <div class="date">29</div>
            <div class="date">30</div>
            <div class="date">1</div>
            <div class="date">2</div>
            <div class="date">3</div>
            <div class="date">4</div>
          </div>
          <div class="item-top">
            <div class="date">5</div>
            <div class="date">6</div>
            <div class="date">7</div>
            <div class="date">8</div>
            <div class="date">9</div>
            <div class="date">10</div>
            <div class="date">11</div>
          </div>
          <div class="item-top">
            <div class="date">12</div>
            <div class="date">13</div>
            <div class="date">14</div>
            <div class="date">15</div>
            <div class="date">16</div>
            <div class="date">17</div>
            <div class="date">18</div>
          </div>
          <div class="item-top">
            <div class="date">19</div>
            <div class="date">20</div>
            <div class="date">21</div>
            <div class="date">22</div>
            <div class="date">23</div>
            <div class="date">24</div>
            <div class="date">25</div>
          </div>
          <div class="item-top">
            <div class="date">26</div>
            <div class="date">27</div>
            <div class="date">28</div>
            <div class="date-one">29</div>
            <div class="date-two">30</div>
            <div class="date-three">31</div>
            <div class="date">1</div>
          </div>
          <div class="item-top">
            <div class="date">2</div>
            <div class="date">3</div>
            <div class="date">4</div>
            <div class="date">5</div>
            <div class="date">6</div>
            <div class="date">7</div>
            <div class="date">8</div>
          </div>
        </div>
      </div>
    </main>
    <!-- 底部 -->
    <a href="">
      <div class="submit">确定</div>
    </a>
  </div>
</body>

</html>